<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>jquery版简易计算器</title>
    <style>
    * { width: 0; padding: 0;}
    #app { width: 480px; margin: 0 auto;}
    input[type='number'] { width: 35%; height: 22px; padding: 6px 12px;}
    #op { width: 15%; height: 40px; text-align: center;}
    #btn { width: 46px; height: 26px;}
    </style>
</head>
<body>
    <div id="app">
        <input type="number" name="numA" id="numA" value="1">
        <select name="op" id="op">
            <option value="">请选择</option>
            <option value="+">+</option>
            <option value="-">-</option>
            <option value="*">*</option>
            <option value="/">/</option>
        </select>
        <input type="number" name="numB" id="numB" value="1">
        <button id="btn">=</button>
    </div>
</body>
<script src="jquery.min.js"></script>
<script>
    $(function() {
        $("#btn").click(function() {
            $("p").remove();
            let numa = parseInt($("#numA").val());
            let numb = parseInt($("#numB").val());
            let op = $("#op").val();
            let sum = 0;
            if(numa == "" && numb == "") {
                alert("计算数据没有填写完整！");
                $("#numA").focus();
                return false;
            }

            if(op == "") {
                alert("请选择运算符！");
                $("#op").focus();
                return false;
            }

            switch (op) {
                case "+":
                    // alert(numa + numb);
                    sum = numa + numb;
                    break;
                case "-":
                    // alert(numa - numb);
                    sum = numa - numb;
                    break;
                case "*":
                    // alert(numa * numb);
                    sum = numa * numb;
                    break;
                case "/":
                    if(numb == 0) {
                        alert("除数不能为零");
                        break;
                    }
                    // alert(numa / numb);
                    sum = numa / numb;
                    break;
            }
            $("#app").after("<p>" + sum + "</p>");
        })
    })
</script>
</html>
